<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix text-left">
        <span class="title-icon">货物入库关联库区</span>
      </div>
      <el-row class="padding-sm">
        <el-col :span="1">
          <span>箱号:</span>
        </el-col>
        <el-col :span="6">
          <el-input
            size="mini"
            v-model.trim="boxNo"
            placeholder="输入完敲回车查询箱号"
            @keyup.enter.native="queryAndprintWaybillLabel"
          ></el-input>
        </el-col>
        <el-col :span="4" style="margin-left: 10px;">
          <el-button
            size="mini"
            type="primary"
            @click="queryAndprintWaybillLabel"
            >查询</el-button
          >
        </el-col>
      </el-row>
      <el-row class="padding-sm">
        <el-col :span="1">
          <span>库区:</span>
        </el-col>
        <el-col :span="6">
          <el-input
            size="mini"
            :rows="5"
            v-model.trim="location"
            placeholder="请输入库存"
          ></el-input>
        </el-col>

        <el-col :span="4" style="margin-left: 10px;">
          <el-button size="mini" type="primary" @click="saveAssociateWarehouse"
            >保存</el-button
          >
        </el-col>
      </el-row>
      <el-row class="padding-sm">
        <el-col :span="1">
          <span>仓库:</span>
        </el-col>
        <el-col :span="6">
          <el-select
            style="width:100%"
            v-model="storageLocation"
            size="mini"
            filterable
            clearable
          >
            <el-option
              v-for="(v, i) in storageLocationSource"
              :key="i"
              :label="storageLocationSource[i]"
              :value="parseInt(i)"
            ></el-option>
          </el-select>
        </el-col>
      </el-row>
    </el-card>
    <el-card class="padding margin-top info-box ">
      <el-row>
        <el-col :span="4">
          <span>运单号:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ waybillNo }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>客户:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>国家:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ country }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>入库渠道:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ inStockName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>客户件数:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ customerCount }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>到仓件数:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ arrivalPackages }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>订单状态:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ statusName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>销售:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ saleName }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>库区:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ reservoirArea }}</span>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="4">
          <span>耗时（毫秒）:</span>
        </el-col>
        <el-col :span="20">
          <span>{{ time }}</span>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>
<script>
import { ajax } from "@/store/yg/common/utils";
import axios from "axios";
import * as constant from "@/store/yg/common/constant";

export default {
  components: {},
  props: [],
  data() {
    return {
      boxNo: "",
      reservoirArea: "",
      waybillNo: "",
      customerName: "",
      inStockName: "",
      customerCount: "",
      arrivalPackages: "",
      customerWay: "",
      statusName: "",
      status: "",
      saleName: "",
      time: "",
      waybillId: "",
      reservoirAreaShow: "",
      country: "",
      warehouseRegionSource: {},
      location: "",
      storageLocation: "",
      storageLocationSource: {}
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.initAssociate();
  },
  methods: {
    // 页面初始化
    async initAssociate() {
      let res = await ajax("initAssociate", {});
      console.log(res);
      if (res && res.code === 200) {
        this.storageLocationSource = res.data;
        // 默认选中
        if (res.data2) {
          this.storageLocation = res.data2;
        }
      }
    },
    queryAndprintWaybillLabel() {
      if (!this.boxNo) {
        this.$message.error("请输入箱号");
        return;
      }
      if (this.boxNo.length < 6) {
        this.$message.error("请输入正确的箱号");
        return;
      }
      ajax("doAssociateWarehouse", { boxNo: this.boxNo }).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            var data = res.data;
            this.waybillNo = data.waybillNo;
            this.customerName = data.customerName;
            this.inStockName = data.inStockName;
            this.customerCount = data.customerCount;
            if (data.arrivalPackages == null || data.arrivalPackages == "") {
              this.arrivalPackages = 0;
            } else {
              this.arrivalPackages = data.arrivalPackages;
            }
            this.customerWay = data.customerWay;
            this.statusName = data.statusName;
            this.status = data.status;
            this.saleName = data.saleName;
            this.time = data.time;
            this.waybillId = data.waybillId;
            this.reservoirAreaShow = data.reservoirAreaShow;
            this.warehouseRegionSource = data.warehouseRegionSource;
            this.country = data.country;
          } else {
            this.$message.error("操作失败" + res.message);
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    saveAssociateWarehouse() {
      if (!this.waybillId) {
        this.$message.error("运单不存在");
        return false;
      }
      if (!this.location) {
        this.$message.error("请输入库区");
        return false;
      }
      if (
        !(
          (this.status && parseInt(this.status) == -10) ||
          parseInt(this.status) <= 50
        )
      ) {
        this.$message.error("运单状态需为待入库，出库，冻结状态");
        return false;
      }
      if (!this.storageLocation) {
        this.$message.error("请选择仓库");
        return false;
      }
      if (
        this.arrivalPackages == null ||
        this.arrivalPackages === "" ||
        this.arrivalPackages == undefined ||
        Number(this.arrivalPackages) < 0
      ) {
        //this.$message.error("当前订单到仓件数为空");
      }
      ajax("saveAssociateWarehouse", {
        waybillId: this.waybillId,
        reservoirArea: this.location,
        storageLocation: this.storageLocation
      }).then(
        res => {
          console.log(res);
          if (res.code == 200) {
            this.$message.success("保存成功");
            this.boxNo = "";
            this.location = "";
            this.waybillNo = "";
            this.customerName = "";
            this.inStockName = "";
            this.customerCount = "";
            this.arrivalPackages = "";
            this.customerWay = "";
            this.statusName = "";
            this.status = "";
            this.saleName = "";
            this.time = "";
          } else {
            if (res.message) {
              this.$message.error(res.message);
            } else {
              this.$message.error("操作失败");
            }
          }
        },
        error => {
          console.log(error);
        }
      );
    }
  }
};
</script>
<style scoped>
.info-box >>> .el-row {
  margin-bottom: 10px;
}
</style>
